<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
    <title>骨医快线</title>
    <link href="../../../css/mui.plus.css" rel="stylesheet"/>
    <style type="text/css">
    	.no-padding {
    		padding: 0;
    	}
    	.btn-area {
    		padding: 80px 30px  50px;
    	}
    	.btn-area>button {
    		padding: 10px 0;
    	}
    	.mui-media {
    		padding: 18px 15px;
    	} 
    	.mui-table-view-cell, .mui-table-view-cell input {
    		font-size: 15px;
    	}
    </style>
</head>
<body>
	<header class="mui-bar mui-bar-nav oe-pri-bar">
	    <a class="mui-action-back mui-icon mui-icon-left-nav mui-pull-left"></a>
	    <h1 class="mui-title">兑换积分</h1>
	</header>
	
	<div class="mui-content">
		<ul class="mui-table-view">
		    <li class="mui-table-view-cell mui-media">
		        <a href="javascript:;">
		            <img id="imgPanel" class="mui-media-object mui-pull-left" src="http://placehold.it/40x30" style="border-radius: 100px;">
		            <div class="mui-media-body">
	                	<span id="namePanel">张三</span>
		                <p id="accountPanel" class="mui-ellipsis">18823456789</p>
		            </div>
		        </a>
		    </li>
		    <li class="mui-table-view-cell" style="padding: 0;">
		    	<div class="mui-input-row">
		    	    <label>兑换金额 ：</label>
		    	    <input id="amountPanel" type="text" placeholder="5477" disabled>
		    	</div>
		    	
		    </li>
		</ul>
		
	    <div class="btn-area">
	    	<button type="button" id="btnCommit" class="mui-btn mui-btn-primary mui-btn-block">确认兑换</button>
	    </div>
		
	</div>
	
    <script src="../../../js/mui.min.js"></script>
    <script src="../../../js/app.js"></script>
    <script>
    	;(function($, a){
    		var wv,
    			commitData,
    			namePanel = document.getElementById("namePanel"),
    			accountPanel = document.getElementById("accountPanel"),
    			imgPanel = document.getElementById("imgPanel"),
    			amountPanel = document.getElementById("amountPanel");
    		
    		$.plusReady(function(){
    			wv = plus.webview.currentWebview();
    			commitData = wv.commitData;
    			namePanel.innerHTML = wv.commitData.withdrawals_account_name ? wv.commitData.withdrawals_account_name: '';
    			accountPanel.innerHTML = wv.commitData.withdrawals_account;
    			amountPanel.placeholder = wv.commitData.points_amount;
    			imgPanel.src = '../../../images/paymode/' + wv.commitData.withdrawals_mode + '.png';
    			
	    		$('.mui-content').on('tap', '#btnCommit', function(){
	    			wv.opener().close();
	    			wv.opener().opener().close();
	    			a.net.post('c_points/create', commitData, function(data){
	    				if(data && data.code === '100'){
	    					$.alert('操作成功', '骨医快线', '确定', function(){
	    						$.back()
	    					})
	    				}
	    			})
	    		});
    		});
    		
    	}(mui, app));
    </script>
</body>
</html>